import React, { Component } from 'react';
import { bindActionCreators } from "redux";
import { connect } from "react-redux";
import * as userInfoActions from 'common/userinfo.js';
import './friend.less';

class Friend extends Component{

	componentWillUnmount(){
		this.props.userInfoActions.update({
			prevRouteUrl: 'friend'
		})
	}

	render(){
		return(
			<div className="friend">
				<div className="friend_nav">
					<div className="friend_nav_right fr">
						<img src="assets/img/add.png"/>
					</div>
					<div className="friend_nav_content">
						<span>消息</span>
					</div>
				</div>
				<ul className="friend_list">
					<li className="friend_item">
						<div className="friend_item_left fl">
							<img src="assets/img/head.png"/>
						</div>
						<div className="friend_item_right fr">
							<span>23:14</span>
						</div>
						<div className="friend_item_content">好友1</div>  
					</li>
					<li className="friend_item">
						<div className="friend_item_left fl">
							<img src="assets/img/head.png"/>
						</div>
						<div className="friend_item_right fr">
							<span>23:14</span>
						</div>
						<div className="friend_item_content">好友2</div>  
					</li>
					<li className="friend_item">
						<div className="friend_item_left fl">
							<img src="assets/img/head.png"/>
						</div>
						<div className="friend_item_right fr">
							<span>23:14</span>
						</div>
						<div className="friend_item_content">好友3</div>  
					</li>
					<li className="friend_item">
						<div className="friend_item_left fl">
							<img src="assets/img/head.png"/>
						</div>
						<div className="friend_item_right fr">
							<span>23:14</span>
						</div>
						<div className="friend_item_content">好友3</div>  
					</li>
					<li className="friend_item">
						<div className="friend_item_left fl">
							<img src="assets/img/head.png"/>
						</div>
						<div className="friend_item_right fr">
							<span>23:14</span>
						</div>
						<div className="friend_item_content">好友3</div>  
					</li>
					<li className="friend_item">
						<div className="friend_item_left fl">
							<img src="assets/img/head.png"/>
						</div>
						<div className="friend_item_right fr">
							<span>23:14</span>
						</div>
						<div className="friend_item_content">好友3</div>  
					</li>
					<li className="friend_item">
						<div className="friend_item_left fl">
							<img src="assets/img/head.png"/>
						</div>
						<div className="friend_item_right fr">
							<span>23:14</span>
						</div>
						<div className="friend_item_content">好友3</div>  
					</li>
				</ul>
			</div>
		)
	}
}

function mapStateToProps(state){
	return {
		userinfo: state.userinfo
	}
}

function mapDispatchToProps(dispatch){
	return {
		userInfoActions: bindActionCreators(userInfoActions, dispatch)
	}
}

export default connect(
	mapStateToProps,
	mapDispatchToProps
)(Friend);